<template>
  <input type="text" :value="currentValue" @input="handleInput" @blur="handleBlur" />
</template>

<script>
import Emitter from '@/mixins/emitter.js'
export default {
  name: 'iInput',
  mixins: [Emitter],
  props: {
    value: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      currentValue: this.value
    }
  },
  methods: {
    handleInput(event) {
      // 获取当前的值
      const value = event.target.value
      this.currentValue = value
      // 组件 v-model 的触发事件
      this.$emit('input', value)
      // 发送给 iFormItem 改变的值 用于 校验
      this.dispatch('iFormItem', 'on-form-chagne', value)
    },
    handleBlur() {
      // 发送给 iFormItem 改变的值 用于 校验
      this.dispatch('iFormItem', 'on-form-blur', this.currentValue)
    }
  },
  watch: {
    value(val) {
      this.currentValue = val
    }
  }
}
</script>

<style lang="less" scoped>
</style>